.list
  font:
    family: $global-font
    size: rem(16px)
  color: $secondary-color
  letter-spacing: 0.4px
  line-height: 32px
  list-style: none

.list--sticky
  position: fixed
  top: 0
  width: calc(25% - 40px)
  max-width: rem(310px)
  overflow: auto
  height: calc(100% - 1em)

.list__heading
  font:
    family: $global-font-secondary
    size: rem(14px)
    weight: $global-font-weight-bold
  line-height: rem(30px)
  color: $primary-color
  text-transform: uppercase
  letter-spacing: 0.4px
  margin: rem(20px 0 0)

.list__link
  color: $secondary-color
  text-decoration: none
  display: block
  padding: rem(7px 10px)
  margin-left: rem(-10px)
  border-radius: 5px
  line-height: 1.3

  &--active
    background: $tertiary-color

  &--disabled
    color: $secondary-lighten-color
    pointer-events: none

.list__desc
  display: block
  font-size: rem(14px)
  color: $secondary-lighten-color
  line-height: 1.4
  max-width: 200px
  margin-top: 3px

.list__img
  display: inline-block
  vertical-align: sub
  margin-left: 5px

.list__dl
  font-family: $global-font
  font-weight: $global-font-weight

.list__dt
  font-size: rem(14px)
  margin-bottom: rem(10px)
  color: $quaternary-color

.list__dd
  font-size: rem($global-font-size)
  margin-left: 0
  margin-bottom: rem(20px)
  line-height: 1.4

.list__ul,
.list__ol
  margin: rem(0 0 0 30px)
  padding: 0
  line-height: 1.8
  font-weight: $global-font-weight

.list__ul
  list-style: square
